<template>
  <div class="no-participation">
    <div class="top-image" id="prodcut"></div>
    <div class="message">
      <div class="message-text">
        <span>{{errMessage}}</span>
      </div>
      <div class="message-icon"></div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    errMessage: {
      type: String
    }
  }
}
</script>

<style lang="stylus">
@import '../../../common/stylus/mixin.styl'
.no-participation
  min-height : inherit
  background-color : rgb(242 242 242)
  .message
    min-height : inherit
    .message-text
      display : inline-block
      font-size : 0.3rem
      text-align : center
      color : rgb(72 47 53)
      width : 100%
      margin-top : 2.7rem
    .message-icon
      width : 2.8rem
      height : 2.45rem
      margin-left : auto
      margin-right : auto
      margin-top : 0.5rem
      background-size : 2.8rem 2.45rem
      bg-image('../img/icon_no_data')
</style>
